<script setup>
	import FirstTitle from "@comp/FirstTitle";
	import {
		Editor,
		Toolbar
	} from "@wangeditor/editor-for-vue";
	import {
		onMounted
	} from "vue";
	import {
		searchDataZzgz
	} from "@/api/search";
	import {
		addOrUpdateZzgz
	} from "@/api/addOrUpdate";


	const city = window.globalObj.name;
	const editorRef = shallowRef();
	const editorRef1 = shallowRef();
	const editorRef2 = shallowRef();
	const editorRef3 = shallowRef();

	const toolbarConfig = {};
	const toolbarConfig1 = {};
	const toolbarConfig2 = {};
	const toolbarConfig3 = {};


	const editorConfig = {
		placeholder: "请输入内容..."
	};
	const mode = ref("default");
	const mode1 = ref("default");
	const mode2 = ref("default");
	const mode3 = ref("default");

	// 加载html
	const initHtml = () => {
		searchDataZzgz({
			m: "工作要点"
		}).then((res) => {
			const {
				data
			} = res
			valueHtml.value = data.find((x) => x.k === "临战准备阶段")?.v || "";
			valueHtml1.value = data.find((x) => x.k === "行动实施阶段")?.v || "";
			valueHtml2.value = data.find((x) => x.k === "结束恢复阶段")?.v || "";
			valueHtml3.value = data.find((x) => x.k === "复杂情况设想和应对处置要点")?.v || "";
		})
	};

	const handleCreated = (editor) => {
		editorRef.value = editor; // 记录 editor 实例，重要！
	};
	const handleCreated1 = (editor) => {
		editorRef1.value = editor; // 记录 editor 实例，重要！
	};
	const handleCreated2 = (editor) => {
		editorRef2.value = editor; // 记录 editor 实例，重要！
	};
	const handleCreated3 = (editor) => {
		editorRef3.value = editor; // 记录 editor 实例，重要！
	};

	const valueHtml = ref(
		"工作内容：进行作战动员和宣传鼓动。及时调整和健全组织、调配和补充干部，发展党员、团员，保证在组织上具备持续作战的能力。发扬民主，发动群众献计献策，研究改进城市人民防空的有效战法和对策。开展立功运动，传播胜利消息，宣扬模范事迹。维护社会纪律和群众纪律。同敌人的心战策反、窃密和其他破坏活动作斗争，保证社会稳定和安全。做好参战民兵、民工的政治工作和战时群众工作。做好后方留守人员和军人家属的工作。<br/>工作方法：广泛开展思想动员发动、宣传鼓动、干部调配、奖励处罚、优抚安抚、反心理战和人民防空知识教育等工作，统筹安排宣传报道等事宜。"
	);

	const valueHtml1 = ref(
		"工作内容：①开展群众性的战场宣传鼓动工作，适时提出简明有力的鼓动口号，传播胜利消息，宣扬英雄事迹，使干部群众始终具有坚定的胜利信心，高昂的士气和英勇的献身精神，自觉地为完成各项城市人民防空任务和实现作战的政治目的而英勇行动。②调整组织，依据减员情况，按预定方案调整组织领导。号召共产党员、共青团员挺身而出，代理组织领导职能。及时吸收先进分子入党、入团。保证在任何情况下，组织不涣散，组织领导不中断。③开展军事民主，发动群众，献计献策，研究城市人民防空制胜的办法。④开展火线立功运动。进行爱国主义和革命英雄主义教育，宣传光荣事迹，及时请功、记功。⑤进行防奸保密工作。教育干部群众保持高度的政治警惕性，严守秘密。进行政治审查，纯洁巩固部队。采取防范措施，确保领导机关和要害部门的安全。调查战区社会政治情况，开展群众性的防奸反特斗争，维护城区治安。⑥开展参战民兵民工的政治工作，动员、组织民兵民工参战支前，开展立功运动，表彰先进，调动参战支前的积极性，妥善处理牺牲人员的善后工作。⑦开展群众工作，展开社会调查，制定和公布战区群众工作守则，揭露敌人罪行和欺骗宣传，争取人民群众的支持，坚定胜利信心。⑧动员和组织群众防空袭、防核、防化学、防生物武器，维护战区社会秩序。<br/>工作方法：广泛采取各种行之有效的手段展开宣传教育，充分发挥街道、社区基层组织的作用，按照统一领导、责任到人、逐级落实、分区分片包干的办法，确保各项政治工作的落实。"
	)

	const valueHtml2 = ref(
		"工作内容：一是强化宣传服务，提高返城及恢复生产人员遵纪守法的意识，主动了解帮助解决返城人员工作、生活上的困难，让返城和恢复生产人员切身体会到党和政府的关怀。二是强化安全服务，保障干部群众生命财产安全，及时了解恢复生产工作进度情况及思想动态，确保生产、生活有序恢复。做好伤员的工作和烈士的善后工作。<br/>工作方法：广泛利用各种宣传手段展开宣传教育，充分发挥街道、社区基层组织的作用，按照统一领导、责任到人、逐级落实、分区分片包干的办法，确保各项政治工作的落实。"
	)
	const valueHtml3 = ref(
		"情况设想1：战争征候明显，城市人员出现恐慌时。<br/>处置要点：及时展开宣传动员，做好干部群众的心理防护和思想稳定工作；展开必要的人员防护演练工作。<br/>情况设想2：战争征候明显，城市人员出现恐慌，并有部分人员盲动、外逃，造成一定社会动荡时。<br/>处置要点：及时展开宣传动员，明确城市人员防护计划和个人行动指南，做好群众的有序疏导和思想稳定工作；展开必要的人员外出疏导和防护演练工作。<br/>情况设想3：突然受到空袭，城市人员出现恐慌，并有部分人员盲动、外逃，社会出现明显动荡时。<br/>处置要点：展开宣传动员，及时通报有关空袭的情况，明确城市人员防护计划和个人行动指南，做好群众的有序疏导和思想稳定工作，组织人员按空袭警报展开人员防护工作<br/>"
	)

	const saveProgramme = () => {
		ElMessageBox.confirm(`确定要保存吗?`, "警告", {
			confirmButtonText: "确定",
			cancelButtonText: "取消",
			type: "warning",
			customClass: "message-box",
		}).then(() => {
			addOrUpdateZzgz({
					m: "工作要点",
					data: [{
							k: "临战准备阶段",
							v: valueHtml.value,
						},
						{
							k: "行动实施阶段",
							v: valueHtml1.value,
						},
						{
							k: "结束恢复阶段",
							v: valueHtml2.value,
						},
						{
							k: "复杂情况设想和应对处置要点",
							v: valueHtml3.value,
						}
					],
				})
				.then((result) => {
					if (result.code === 200) {
						ElMessage.success("操作成功");
						initHtml();
					} else {
						ElMessage.error(result.msg);
					}
				})
				.catch(() => {});
		});
	}

	onMounted(() => {
		initHtml();
	});
	onBeforeUnmount(() => {
		const editor = editorRef.value;
		const editor1 = editorRef1.value;
		const editor2 = editorRef2.value;
		const editor3 = editorRef3.value;
		if (!editor) return;
		if (!editor1) return;
		if (!editor2) return;
		if (!editor3) return;
		editor.destroy();
		editor1.destroy();
		editor2.destroy();
		editor3.destroy();

	});
</script>
<template>
	<div class="">

		<div class="top-15">主要明确临战准备、行动实施、结束恢复等阶段政治工作的内容、方法，以及复杂情况设想和应对处置要点等。</div>
		<FirstTitle name="临战准备阶段" class="top-15" />
		<div style="border: 1px solid #ccc" class="top-15">
			<Toolbar style="border-bottom: 1px solid #ccc" :editor="editorRef" :defaultConfig="toolbarConfig"
				:mode="mode" />
			<Editor style="height: 500px; overflow-y: hidden" v-model="valueHtml" :defaultConfig="editorConfig"
				:mode="mode" @onCreated="handleCreated" />
		</div>

		<FirstTitle name="行动实施阶段" class="top-15" />
		<div style="border: 1px solid #ccc" class="top-15">
			<Toolbar style="border-bottom: 1px solid #ccc" :editor="editorRef1" :defaultConfig="toolbarConfig1"
				:mode="mode1" />
			<Editor style="height: 500px; overflow-y: hidden" v-model="valueHtml1" :defaultConfig="editorConfig"
				:mode="mode1" @onCreated="handleCreated1" />
		</div>

		<FirstTitle name="结束恢复阶段" class="top-15" />
		<div style="border: 1px solid #ccc" class="top-15">
			<Toolbar style="border-bottom: 1px solid #ccc" :editor="editorRef2" :defaultConfig="toolbarConfig2"
				:mode="mode2" />
			<Editor style="height: 500px; overflow-y: hidden" v-model="valueHtml2" :defaultConfig="editorConfig"
				:mode="mode2" @onCreated="handleCreated2" />
		</div>

		<FirstTitle name="复杂情况设想和应对处置要点" class="top-15" />
		<div style="border: 1px solid #ccc" class="top-15">
			<Toolbar style="border-bottom: 1px solid #ccc" :editor="editorRef3" :defaultConfig="toolbarConfig3"
				:mode="mode3" />
			<Editor style="height: 500px; overflow-y: hidden" v-model="valueHtml3" :defaultConfig="editorConfig"
				:mode="mode3" @onCreated="handleCreated3" />
		</div>




		<div class="flex-justify-end top-20">
			<el-button type="primary" class="save-btn" @click="saveProgramme">保存</el-button>
		</div>
	</div>
</template>
<style scoped lang="scss"></style>